<template>
	<div class="myselforder">
	<div class="header">
		<div class="go">
			<i class="el-icon-erp-shangyiye" @click="back"></i>
			<p>{{title}}</p>
		</div>
	</div>
	<div class="serach">
		<div class="title" v-for="(item,index) in list" :class="index==sorts ? 'active' :''" @click="search(item,index)">{{item.title}}</div>
	</div> 
</div>
</template>

<script>
import { data } from '@/common/js/orderheader'
export default {
	name: 'myselforder',
	props:{
		title:{
			type:String,
			default:''
		},
		sort:{
			type:Number,
			default:0
		}
	},
	data() {
		return {
			list:data.headerList,
			sorts:this.sort
		}
	},
	mounted() {
       
	},
	methods: {
		//返回
		back() {
			this.$router.go(-1)
		},
		//查询
		search(item,index) {
			this.sorts = index;
			this.$emit("chonsePramas",item)
		}
	}
}
</script>

<style lang="less" scoped>
   .myselforder {
   	width: 100%;
   	position: fixed;
   	top: 0;
   	left: 0;
   	.header {
   		width: 100%;
   		.go {
   			display: flex;
   			width: 100%;
   			height: 80px;
   			i {
   				width: 60px;
   				font-size: 40px;
   				font-weight: 700;
   				line-height: 80px;
   			}
   			p {
   				flex: 1;
   				text-align: center;
   				font-size: 30px;
   				line-height: 80px;
   			}
   		}
   	}
   	.serach {
   		width: 100%;
   		display: flex;
   		margin-bottom: 30px;
   		.title {
   			flex: 1;
   			height: 60px;
   			text-align: center;
   			font-size: 28px;
   			&.active{
   				border-bottom: 2px solid #FF0000;
   			}
   		}
   	  }
   }
</style>